/****************************/
/* START: Body */
/****************************/
body
{
	/*/
	background-attachment: fixed;
	background-color: #000000;
	background-color: skyblue;
	background-color: #94e3e5;
	*/
	background-color: #cef2f3;
	   
	/***************************/
	/* START: FONT
	/***************************/
	/*
	font: 14px/21px georgia, Arial, helvetica, verdana, Lucida Sans, Lucida Grande, Lucida Sans Unicode, sans-serif;
	font-family: monospace, Courier New/*, Courier, monospace/*georgia /* Akshar Unicode*/;
	font-family: Merriweather, serif;
	*/
	font-family: Nunito, sans-serif;
	
	/*
	font-size: 12px;
	font-weight: normal;
	text-decoration: none;
	text-align: left;
	color: #00022e;
	*/
	color: #163655;
	/***************************/
	/* END: FONT
	/***************************/
}
/****************************/
/* END: Body */
/****************************/

@font-face
{
	font-family: BubblegumSansRegular;
	
	/*
	font-style: normal italic;
	*/
	
	src: url("../css/fonts/BubblegumSans-Regular.otf");
}

.menu_top
{
	position: fixed;
	
	top: 0%;
	
	width: 100%;
	
	left: 0%;
	
	background-color:#ffffff;
	
	/*
	color:#00022e;
	*/
	color:#003f4a;
	
	/*
	font-family: Gill Sans, Verdana;
	font-family: times, Times New Roman, times-roman, georgia, serif;
	*/
	font-family: BubblegumSansRegular, times, times-roman, georgia, serif, Arial;
	
	/*
	font-weight: bold;
	*/
	
	/*
	font-size: 11px;
	*/
	
	font-size: 51px;
	
	/*
	line-height: 14px;
	*/
	line-height: 44px;

	text-transform: none;
	
	/*
	letter-spacing: 2px;
	*/
	letter-spacing: -2px;

	margin: 0;

	padding: 0px 0px 6px 0px;
	
	vertical-align: middle;
}

.menu_left
{
	/* Make the position of this element static/fixed. */
	position: fixed;
	
	/* Position immediately below menu_top. */
	top: 16%;
	
	/* Position at the far left of the window. */
	left: 0%;
	
	/* Lengthen to the full height of the window. */
	height: 100%; /* Full height */
	
	
	/* Enable scrolling if content in the section overflows. */
	overflow: auto;

	/* Remove bullets. A navigation bar does not need list markers. */
	list-style-type: none;
	
	margin: 0;
	
	padding: 0;
	
	/* RMG blue - light = #3982cc */
	/* RMG blue - dark = #163655 */
	background-color:#163655;
}

.menu_left ul
{
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 200px;
	background-color: #f1f1f1;
	
	border: 1px solid #555;
}

.menu_left li
{
	/*
	Displaying the links as block elements makes the whole link area clickable (not just the text), and it allows us to specify the width (and padding, margin, height, etc. if you want)
	*/
	display: block;
	
	/*
	Block elements take up the full width available by default.
	*/
	/*
	width: 100%;
	*/
	
	border-bottom: 1px solid #ffffff;
}


.menu_left li a
{
	display: block;
	color: #ffffff;
	padding: 8px 16px;
	text-decoration: none;
}

.menu_left li:last-child
{
	border-bottom: none;
}

/* Change the link color on hover */
.menu_left li a:hover
{
	background-color: #555;
	color: white;
}

/*
	Active/Current Navigation Link
	Add an "active" class to the current link to let the user know which page he/she is on:
*/
.menu_left .active
{
	background-color: #4CAF50;
	color: white;
}

/*
Center Links & Add Borders

Add text-align:center to <li> or <a> to center the links.

Add the border property to <ul> add a border around the navbar. If you also want borders inside the navbar, add a border-bottom to all <li> elements, except for the last one:
*/

.main_content
{
	/* Position the top of the section immediately below menu_top. */
	padding-top: 2%;

	/* Position the section immediately to the right of menu_left. */
	padding-left: 25%;
	
	/* Position the section immediately above menu_bottom. */
	padding-bottom: 2%;
}

.main_content > h1:first-child
{
	padding-top: 5%;
}

.footer
{
	position: fixed;
	
	bottom: 0%;
	
	width: 100%;
	
	left: 0%;
	
	/* RMG black = #2a0000*/
	/* RMG blue - dark = #163655*/
	background-color:#163655;
	
	color:#ffffff;
}

@media only screen and (max-width: 600px)
{
	.main_content
	{
		/* Position the top of the section immediately below menu_top. */
		padding-top: 20%;
	
		/* Position the section immediately to the right of menu_left. */
		padding-left: 30%;
		
		/* Position the section immediately above menu_bottom. */
		padding-bottom: 2%;
	}
	
	.menu_left
	{
		top: 15%;
	}
}